<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="js/jquery-1.11.3.js"></script>
</head>
<body>
  <button id="btnMinus">-</button>
  <span>0</span>
  <button id="btnAdd">+</button>
  <script>
    //先实现+
    //DOM 4步
    //1. 查找触发事件的元素
    $("#btnAdd")
    //2. 绑定事件处理函数
    .click(function(){
      //3. 查找要修改的
      var $span=$("span");
      //4. 修改元素
      //4.1 先取出span中现在的数量，转为整数
      var n=parseInt($span.html());
      //4.2 将n+1
      n++;
      //4.3 将新的n再放回去: 
      $span.html(n);
    })
    //再实现-
    //DOM 4步
    //1. 查找触发事件的元素
    $('#btnMinus')
    //2. 绑定事件处理函数
    .click(function(){
      //3. 查找要修改的
      var $span=$("span");
      //4. 修改元素
      //4.1 先取出span中现在的数量，转为整数
      var n=parseInt($span.html())
      //4.2 如果n>0，才能n-1
      if(n>0){ n-- }
      //4.3 将新的n再放回去:
      $span.html(n); 
    })
  </script>
</body>
</html>
